import React, { Component } from 'react';
import './App.less';
import {observer} from "mobx-react";
import  Mobx from  './mobx'
import Header from  './js/Header'
import Foot from  './js/Footer'
import Lunbo from  './js/Lunbo'
import axios from 'axios'
import { Icon } from 'antd-mobile';
@observer class App extends Component {
    constructor(props) {
        super(props)
        this.state={
            items:[],
            Creates:[],
            Zixun:[]
        }
    }
    componentWillMount(){
        Mobx.history= this.props.history
    }
    toDetail(item){
        console.log(item)
        Mobx.history.push('/Detail/'+item.creativity.id)
    }
    toSchool(item){
        this.props.history.push('/School/'+item)
    }
    componentDidMount(){
        // 获取活动
        axios.get('http://www.niuduxiu.com/pc/activity/getList.jhtml?pageNumber=1&pageSize=4&status=all&activityCategoryName=%E4%B8%93%E9%A2%98%E6%B4%BB%E5%8A%A8')
            .then((item)=>{
                this.setState({
                    items:item.data.data.content
                })
            })
        // 获取创意
        axios.get('http://www.niuduxiu.com/creativity/findByType.jhtml?aid=-1&type=0&cid=-1&pageNumber=1&pageSize=8&memberID=')
            .then((item)=>{
                this.setState({
                    Creates:item.data.cindex
                })
            })
        // 获取资讯
            axios.get('http://www.niuduxiu.com/pc/article/page/%E5%B0%8F%E7%89%9B%E5%A4%B4%E6%9D%A1/%E5%A4%B4%E6%9D%A1%E8%B5%84%E8%AE%AF.jhtml?pageNumber=1&pageSize=8')
                .then((item)=>{
                    this.setState({
                        Zixun:item.data.data.content
                    })
                })
        }
          to(item){
            this.props.history.push('/'+item)
          }
        toInformation(item){
            this.props.history.push('/InformationDetail/'+item.id)
        }
      render() {
        return (
          <div className='App'>
              <Header />
              <Foot />
              <Lunbo  />
              <ul className='IndexActivity'>
                  <li onClick={this.to.bind(this,'Activity/全部')}>
                      <div>
                          <img src={require('./img/activity.png')} alt=""/>
                          <p>活动</p>
                      </div>
                  </li>
                  <li onClick={this.to.bind(this,'Information')}>
                      <div>
                          <img src={require('./img/activity.png')} alt=""/>
                          <p>咨询</p>
                      </div>
                  </li>
                  <li onClick={this.toSchool.bind(this,1)}>
                      <div>
                          <img src={require('./img/activity.png')} alt=""/>
                          <p>学校</p>
                      </div>
                  </li>
                  <li onClick={this.toSchool.bind(this,2)}>
                      <div>
                          <img src={require('./img/activity.png')} alt=""/>
                          <p>工作室</p>
                      </div>
                  </li>
              </ul>
              <div className='titleName'>精彩活动</div>
              <div className='wonderfulActivities'>
                        {
                            this.state.items.map((item,index)=>{
                                return(
                               <div className='wonderfulOneActivities'  key= {index}>
                                    <div>
                                        <img src={item.mCoverImage} alt=""/>
                                    </div>
                                    <p className='shengluehao'>{item.title}</p>
                               </div>
                                )
                            })
                        }
              </div>
              <p className='LookAll'  onClick={this.to.bind(this,'Activity')}>查看全部 <Icon type={'right'} className='img'/></p>
              <div className='titleName'>创意推荐</div>
              <div className='creativeRecommendation'>
                      {
                          this.state.Creates.map((item,index)=>{
                              return(
                                  <div className='creativeSonRecommendation'  key= {index} onClick={this.toDetail.bind(this,item)}>
                                      <div>
                                          <img src={item.creativity.indexImage} alt=""/>
                                      </div>
                                      <p className='shengluehao'>{item.creativity.titleName}</p>
                                      <p className='caozuo'>
                                          <span><img src={require('./img/eye.png')} alt=""/>{item.creativity.browseCount}</span>
                                          <span><img src={require('./img/zan.png')} alt=""/>{item.creativity.likeCount}</span>
                                          <i className='right'>
                                              <img src={require('./img/tuijian.png')} alt=""/>
                                          </i>
                                      </p>
                                  </div>
                              )
                          })
                      }
              </div>
              <p className='LookAll'  onClick={this.to.bind(this,'Create')}>查看全部 <Icon type={'right'} className='img'/></p>
              <div className='titleName'>我的-资讯</div>
              <div className='Information'>
                  {
                      this.state.Zixun.map((item,index)=>{
                          return(
                              <div className='InformationOne' key={index} onClick={this.toInformation.bind(this,item)}>
                                  <div className='left'>
                                      <img src={item.mPic} alt=""/>
                                  </div>
                                  <div className='right'>
                                      <p className='title shengluehao'>{item.title}</p>
                                      <p className='content'>
                                          {item.text.trim()}
                                      </p>
                                      <span><img src={require('./img/eye.png')} alt=""/>{item.hits}</span>
                                  </div>
                              </div>
                          )
                      })
                  }
              </div>
              <p className='LookAll'  onClick={this.to.bind(this,'Information')}>查看全部 <Icon type={'right'} className='img'/></p>
              <div className='ApptitleName'>暂无更多了。。</div>
          </div>
        );
      }
}

export default App;
